import MathJax from './MathJax.js'

function getOption(graphInfo){
//给节点设置样式
    let nodes=graphInfo['nodes'];
    let links=graphInfo['links'];
    //console.log(links);
//设置option样式
    return {
        title: {
            text: title,
            left: 'center',
            textStyle:{
                fontSize:20
            },
            bottom:20
        },
        tooltip: {
            trigger: 'item'
        },
        autoCurveness:true,
        backgroundColor:'white',
        roam: true,
        series: [
            {
                type: 'graph',
                layout: 'force',
                force:{
                    repulsion : 200, edgeLength:[50,100]
                },
                ribbonType: false,
                symbol: "circle",
                edgeSymbol:['none', 'arrow'],
                symbolSize: 27,
                edgeSymbolSize: 10,
                nodes: nodes,
                links: links,
                label: {
                    normal: {
                        show: true
                    }
                },
                draggable:true
            }
        ]
    };
}
function nodeStyle(title){
   return  { 
       name: title,
       itemStyle: {borderColor: 'black',color:'white',borderWidth: 3},
       label:{
           show:true,
           position:'inside',
           fontSize:15,
           color:'black',
           fontWeight:'bold'
        }
    }
}
function edgeStyle(selectNode){
    //有向图啦
    matrix[selectNode[0]][selectNode[1]]=1;
    return {
        source: selectNode[0],
        target: selectNode[1],
        value:100,
        lineStyle: {
            width: 5,
            color: '#000',
            type:'solid',
            opacity:0.8,
            ignoreForceLayout:true
        }
    };
}
function initData(){
    nodes=[],links=[],option={},title="";matrix=[];
}
function getIndex(letter){
     //获取下标

}
let myChart;
let nodes=[],links=[],option={},title="";  //显示图的点集和边集
let matrix=[];//关系矩阵
var app=new Vue({
    el:"#app",
    data:{
        sets:"{1,2,3,4}",
        relations:"{(1,1),(2,2),(3,3),(4,4),(1,2),(1,4),(2,1),(3,2),(3,4)}",
        matrixs:'',
        isShowMatrix:false,
        isMatrix:false,
        result1:"",
        result2:"",
        result3:"",
        result4:"",
        result5:""
    },
    methods: {
        relationShow(){
            initData();
            //字符串处理
            //console.log(this.sets+this.relations);
            let sets=[],relations=[];
            //检查格式是否正确
            try{
                var reg = RegExp(/^{[a-zA-Z0-9]+(,([a-zA-Z0-9]+))*}$/);
                if(!this.sets.match(reg)){
                    modalApp.modalAlert("集合格式输入不正确");return;
                }
                var reg1=RegExp(/^{\([a-zA-Z0-9]+,[a-zA-Z0-9]+\)(,\([a-zA-Z0-9]+,[a-zA-Z0-9]+\))*}$/);
                if(!this.relations.match(reg1)){
                    modalApp.modalAlert("关系格式输入不正确");return;
                }
                sets=this.sets.slice(1,this.sets.length-1).split(',');
                console.log(sets);
                let rel=this.relations.slice(1,this.relations.length-1).split(',');
                for(let i=0;i<rel.length;i=i+2){
                    relations.push({
                        a1:rel[i].slice(1),
                        a2:rel[i+1].slice(0,rel[i+1].length-1),
                    });
                }
                console.log(relations);
                //如果关系中的点在集合中不存在则 报错
                for(let i=0;i<sets.length;i++){
                    nodes.push(nodeStyle(sets[i]));
                    matrix[i]=[];
                    for(let j=0;j<sets.length;j++){
                        matrix[i][j]=0;
                    }
                }
                for(let i=0;i<relations.length;i++){
                    let t1=sets.indexOf(relations[i].a1);
                    let t2=sets.indexOf(relations[i].a2);
                    if(t1!=-1&&t2!=-1){
                        if(t1==t2){
                            nodes[t1].itemStyle.color='black';
                            nodes[t1].label.color='white';
                        }
                        links.push(edgeStyle([t1,t2]));
                    }
                    else{
                        modalApp.modalAlert("关系中的点在集合中不存在");return;
                    }
                }
                title="二元关系图形(有向图)表示"
                console.log(nodes);
                console.log(links);
                let jsonData={"nodes":nodes,"links":links}
                option=getOption(jsonData);
                if(this.isMatrix){
                    this.$nextTick(function () {
                        myChart = echarts.init(document.getElementById('echartsDiv'));
                        myChart.setOption(option);
                    }) 
                }
                else{
                    let matrixs="$$\\begin{bmatrix}"
                    for(let i=0;i<matrix.length;i++){
                        for(let j=0;j<matrix[i].length;j++){
                            if(j!=(matrix[i].length-1)) matrixs+=" "+matrix[i][j]+" &";
                            else matrixs+=" "+matrix[i][j]+" \\\\";
                        }
                    }
                    matrixs+="\\end{bmatrix}$$";
                    document.getElementById("matrix").innerHTML= "";
                    this.matrixs=matrixs;
                    this.isShowMatrix=true;
                    document.getElementById("matrix").innerHTML= matrixs;
                    this.formatMath();
                    console.log(matrixs);
                }
                //判断是否自反
                if(!selfReflexivity()){
                    this.result1="不具有自反性"
                }
                else{
                    this.result1="具有自反性"
                }
                //判断反自反性
                if(!antiReflexivity()){
                    this.result2="不具有反自反性"
                }
                else{
                    this.result2="具有反自反性"
                }
                //判断是否对称性
                if(!symmetry()){
                    this.result3="不具有对称性"
                }
                else{
                    this.result3="具有对称性"
                }
                //判断是否反对称性
                if(!antiSymmetry()){
                    this.result4="不具有反对称性"
                }
                else{
                    this.result4="具有反对称性"
                }
                if(!Transitive()){
                    this.result5="不具有传递性"
                }
                else{
                    this.result5="具有传递性";
                }
            }catch(e){
                console.log(e);
                return;
            }
        },
        formatMath() {
            let that = this;
            console.log(MathJax);
            that.$nextTick(function () {
                if(MathJax.isMathjaxConfig){//判断是否初始配置，若无则配置。
                    MathJax.initMathjaxConfig();
                }
                MathJax.MathQueue("matrix");//传入组件id，让组件被MathJax渲染
            })
        },
        switchMatrix(){
            this.isMatrix=!this.isMatrix;
            console.log(this.isMatrix);
            if(this.isMatrix){
                this.$nextTick(function () {
                    myChart = echarts.init(document.getElementById('echartsDiv'));
                    myChart.setOption(option);
                }) 
            }
            else{
                    let matrixs="$$\\begin{bmatrix}"
                    for(let i=0;i<matrix.length;i++){
                        for(let j=0;j<matrix[i].length;j++){
                            if(j!=(matrix[i].length-1)) matrixs+=" "+matrix[i][j]+" &";
                            else matrixs+=" "+matrix[i][j]+" \\\\";
                        }
                    }
                    matrixs+="\\end{bmatrix}$$";
                    document.getElementById("matrix").innerHTML= "";
                    this.matrixs=matrixs;
                    this.isShowMatrix=true;
                    document.getElementById("matrix").innerHTML= matrixs;
                    this.formatMath();
                    console.log(matrixs);
            }
        }
    },
    watch:{
        isMatrix(val){
            console.log(val);
        }
    }
})
var modalApp=new Vue({
    el:"#myModal1",
    data:{
        message:""
    },
    methods:{
        modalAlert(str){
            this.message=str;
            $('#myModal1').modal('toggle');
        }
    }
})
//自反性
function selfReflexivity(){
    for(let i=0;i<matrix.length;i++){
        if(matrix[i][i]!=1) return false
    }
    return true;
}
//反自反性
function antiReflexivity(){
    for(let i=0;i<matrix.length;i++){
        if(matrix[i][i]==1) return false
    }
    return true;
}
//对称性
function symmetry(){
     for(let i=0;i<matrix.length;i++){
        for(let j=i;j<matrix[i].length;j++){
            if(matrix[i][j]!=matrix[j][i]) return false
        }
    }
    return true;
}
//反对称性
function antiSymmetry(){
     for(let i=0;i<matrix.length;i++){
        for(let j=i+1;j<matrix[i].length;j++){
            if(matrix[i][j]==1&&(matrix[i][j]==matrix[j][i])) return false
        }
    }
    return true;
}
//传递性
function Transitive(){
    //传递性
    let p = 0,x=matrix.length,y=matrix.length;
    for(let i = 0 ; i < x ; i++)
    {
        for(let j = 0 ; j < y ; j++)
        {
            if( 1 == matrix[i][j] )
            {
                for(let k = 0 ; k < y ; k++)
                {
                    if( 1 == matrix[j][k] && 1 != matrix[i][k] )
                    {
                        p = 1;
                        break;
                    }
                }
            }
        }
    }
    if(p) return false;
    else return true;
}
//各个特性的计算
